<!DOCTYPE html>
<html>

<head>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta charset="utf-8"/>
    <title>用户登录</title>
    <link rel="stylesheet" href="assets/libs/layui/css/layui.css"/>
    <link rel="stylesheet" href="assets/css/login.css" media="all">
</head>

<body>
<div class="login-wrapper">

    <!--<div class="login-header">-->
        <!--<img src="assets/images/logo_1.png"> JeeCp-->
    <!--</div>-->

    <div class="login-body">
        <div class="layui-card">
            <div class="layui-card-header">
                <i class="layui-icon layui-icon-engine"></i>&nbsp;&nbsp;用户登录
            </div>
            <form class="layui-card-body layui-form layui-form-pane">
                <div class="layui-form-item">
                    <label class="layui-form-label"><i class="layui-icon layui-icon-username"></i></label>
                    <div class="layui-input-block">
                        <input name="username" type="text" lay-verify="required" placeholder="账号"
                               class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label"><i class="layui-icon layui-icon-password"></i></label>
                    <div class="layui-input-block">
                        <input name="password" type="password" lay-verify="required" placeholder="密码"
                               class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label"><i class="layui-icon layui-icon-vercode"></i></label>
                    <div class="layui-input-block">
                        <div class="layui-row inline-block">
                            <div class="layui-col-xs7">
                                <input name="validCode" style="width:170px" type="text" lay-verify="required" placeholder="验证码" class="layui-input">
                                <input name="deviceId" type="hidden"/>
                            </div>
                            <div class="layui-col-xs5" style="padding-left: 10px;">
                                <img class="login-captcha" src="#" style="display:none">
                            </div>
                        </div>
                    </div>
                </div>
                 
                <div class="layui-form-item">
                    <button lay-filter="login-submit" class="layui-btn layui-btn-fluid" lay-submit>登 录</button>
                </div>
            </form>
        </div>
    </div>


    <div class="login-footer">
        <p>© 2018 <a href="javascript:;" target="_blank">JeeCp版权所有</a></p>
         
    </div>

</div>

<script type="text/javascript" src="assets/libs/jquery-3.2.1.min.js"></script>
<script type="text/javascript" src="assets/libs/layui/layui.js"></script>
<script type="text/javascript" src="assets/libs/login.js"></script>
<script type="text/javascript" src="module/Math.uuid.js"></script>
<script>
layui.config({
    base: 'module/'
}).use(['config', 'form'], function () {

	let uuid = Math.uuid();
    var $ = layui.jquery;
    $("input[name='deviceId']").val(uuid);
    var form = layui.form;
    var config = layui.config;
    if (config.getToken()) {
        location.replace('./');
        return;
    }

    // 表单提交
    form.on('submit(login-submit)', function (obj) {
        var field = obj.field;
        field.grant_type = 'password';
        field.client_id = config.clientId ;
        field.client_secret = config.clientSecret ;
		field.scope = config.scope;
        layer.load(2);
        $.ajax({
        	url: config.base_server + 'api-auth/oauth/token',
            data: field,
            type: 'POST',
            success: function (data) {
                console.log(JSON.stringify(data));
                if (data.access_token) {
                    config.putToken(data);
                    layer.msg('登录成功', {icon: 1, time: 500}, function () {
                        location.replace('./');
                    });
                } else {
                    layer.closeAll('loading');
                    layer.msg('登录失败，请重试', {icon: 5, time: 500});
                }
            },
            error: function (xhr) {
                layer.closeAll('loading');
                if (xhr.status == 400) {
                    var error =JSON.parse(xhr.responseText) ;
                	var error_msg = error.error_description ? error.error_description :error.msg ;
                    layer.msg(error_msg ? error_msg  : xhr.statusText, {icon: 5, time: 500});
                    // 图形验证码
				    $('.login-captcha').attr("src", config.base_server + "api-auth/validata/code/"+uuid);
				    $('.login-captcha').attr("style", "");
                    
                }else if( xhr.status  == 401){
                	var error =JSON.parse(xhr.responseText) ;
                	var error_msg = error.error_description ? error.error_description :error.msg ;
                    layer.msg(error_msg ? error_msg  : xhr.statusText, {icon: 5, time: 500});
                    
                }
                else if( xhr.status  == 500){
                    layer.msg('服务器异常,请联系管理员', {icon: 5, time: 500});
                }else if( xhr.status  == 0){
                    layer.msg('网关异常,请联系管理员', {icon: 5, time: 900});
                }
            }
        });
        return false; //阻止表单跳转
    });

    // 图形验证码
    $('.login-captcha').attr("src", config.base_server + "api-auth/validata/code/"+uuid);
    $('.login-captcha').attr("style", "");

    // 图形验证码
    $('.login-captcha').click(function () {
            this.src = this.src + '?timestamp=' + (new Date).getTime();
    });
     
});
</script>
<script type='text/javascript'>
    (function(m, ei, q, i, a, j, s) {
        m[i] = m[i] || function() {
            (m[i].a = m[i].a || []).push(arguments)
        };
        j = ei.createElement(q),
            s = ei.getElementsByTagName(q)[0];
        j.async = true;
        j.charset = 'UTF-8';
        j.src = 'https://static.meiqia.com/dist/meiqia.js?_=t';
        s.parentNode.insertBefore(j, s);
    })(window, document, 'script', '_MEIQIA');
    _MEIQIA('entId', 118789);
</script>
</body>
</html>